<template>
    <page class="notice-detail">
        <v-back/>
        <div class="scroll">
            <div class="notice-detail-title-group">
                <p>{{detail.title}}</p>
                <span class="notice-detail-title-group-time">{{detail.modifyTime}}</span>
            </div>
            <div class="notice-detail-content" v-html="detail.content">

            </div>
        </div>
    </page>
</template>

<script>
    export default {
        name: "detail",
        data(){
            return{
                detail: {},
            }
        },

        created(){
            this.getDetail();
        },

        methods: {

            async getDetail(){
                this.$loading();
                const res = await this.$http.get(`/common/mp/announcement/${this.$route.params.id}`);
                this.detail = res.data;
                this.$loading.close();
            }
        }

    }
</script>

<style scoped lang="less">
    .notice-detail{
        .scroll{
            overflow-y: auto;
        }
        &-title-group{
            padding: @padding 20px;
            p{
                font-size: @big;
                font-weight: 700;
            }
            &-time{
                display: block;
                color: #999;
                font-size: @md;
                margin-top: 10px;
            }
        }
        &-content{
            padding: 0 @padding @padding;
            p{
                font-size: @large;
                line-height:28px;
            }

        }
    }
</style>
